<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>账号管理</title>
    <style>
        #all_light { /*整个弹窗的页面*/
            opacity: 0.8; /*透明度*/
            width: 100%; /*宽度*/
            height: 2300px; /*高度，不能百分百*/
            background: #000; /*背景色*/
            position: absolute;
            top: 0;
            left: 0; /*定位*/
            display: none; /*隐藏*/
            z-index: 2; /*覆盖*/
        }

        #contents { /* 弹框的页面*/
            width: 400px; /*宽度*/
            height: 150px; /*高度*/
            background: #fff; /*背景色*/
            display: none; /*隐藏*/
            z-index: 3; /*覆盖*/
            position: absolute;
            top: 100px;
            left: 400px; /* 定位*/
        }
        input{
            margin-bottom: 10px;
        }
    </style>
</head>
<body>
<div>
    <a th:href="@{/admin/home}">返回</a>
    <table border="1" cellspacing="0" cellpadding="3">
        <tr>
            <th>账号</th>
            <th>密码</th>
            <th>状态</th>
            <th>操作</th>
        </tr>
        <tr th:each="admin:${allAdmins}">
            <td th:text="${admin.adminName}"></td>
            <td th:text="${admin.password}"></td>
            <td th:text="${admin.state} == 1 ? '正常':'冻结'"></td>
            <td><span style="color: blue" onclick="show(${admin})">修改</span>
                <span th:if="${admin.adminId != 1}">
                    |<a th:href="@{/admin/freeze/}+@{${admin.adminId}}" th:text="${admin.state} == 0 ? '解冻':'冻结'"></a>
                    |<a th:href="@{/admin/delete/}+@{${admin.adminId}}" title="">注销</a>
                </span>
            </td>
        </tr>
    </table>
    <div id="contents">
        <form name="updateForm" th:action="@{/admin/update}">
            <input type="hidden" name="adminId">
            账号：
            <input type="text" name="adminName" placeholder="请输入">
            <br>
            密码：
            <input type="password" name="password" placeholder="请输入">
            <br>
            <input type="hidden" name="state">
            <input type="button" value="修改" onclick="check()">
            <button onclick="close()">取消</button>
        </form>
    </div>
    <div id="all_light" onclick="close()"></div>
</div>
</body>
<script>
    show = function(admin) {
        document.getElementById('all_light').style.display = 'block';
        document.getElementById('contents').style.display = 'block';
    }
    close = function() {
        document.getElementById('all_light').style.display = 'none';
        document.getElementById('contents').style.display = 'none';
    }
    check = function () {
        if (document.loginForm.adminName.value == ""){
            alert("请输入账号")
            document.loginForm.adminName.focus();
            return false;
        }
        if (document.loginForm.password.value == ""){
            alert("请输入密码")
            document.loginForm.password.focus();
            return false;
        }
        document.updateForm.submit();
    }
</script>
</html>